<template>
	<div class="main">
		<h6 @click="back" style="cursor: pointer;">
			<Icon type="md-arrow-back" />返回上一页
		</h6>
		<h1>Create single collectible</h1>
		<h3>upload file</h3>
		<Upload
			multiple
			type="drag"
			action="//jsonplaceholder.typicode.com/posts/"
		>
			<div style="padding: 20px 0">
				<Icon
					type="ios-cloud-upload"
					size="52"
					style="color: #3399ff"
				></Icon>
				<p>Click or drag files here to upload</p>
			</div>
		</Upload>
		<div class="flex ac sb margin padding">
			<h3>
				<b>Put on sale</b><br />
				<p>You’ll receive bids on this item</p>
			</h3>
			<p>
				<i-switch v-model="switch1" @on-change="change" />
			</p>
		</div>
		<div class="flex ac sb margin padding">
			<h3>
				<b>Put on sale</b><br />
				<p>You’ll receive bids on this item</p>
			</h3>
			<p>
				<i-switch v-model="switch1" @on-change="change" />
			</p>
		</div>
		<div class="flex ac sb margin padding">
			<h3>
				<b>Put on sale</b><br />
				<p>You’ll receive bids on this item</p>
			</h3>
			<p>
				<i-switch v-model="switch1" @on-change="change" />
			</p>
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {
			switch1: '',
		};
	},
	methods: {
		back() {
			window.history.go(-1);
		},
		change() {
			console.log('switchchange');
		},
	},
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.main {
	width: 500px;
	margin: 50px auto;
}
</style>
